<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>贵州移动乡村振兴平台</title>
    <!-- 引入样式 -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- import Vue before Element -->
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <script src="./js/echarts.4.2.1.min.js"></script>
</head>
<style>
    * {
        padding: 0;
        margin: 0;
    }

    #app {
        width: 100vw;
        height: 100vh;
        background: url(./beijingtupian.png) no-repeat 100% 100%;
    }

    .leftBox::-webkit-scrollbar {
        /*滚动条整体样式*/

        width: 10px;
        /*高宽分别对应横竖滚动条的尺寸*/

        height: 1px;

    }

    .leftBox {
        width: 400px;
        height: 400px;
        overflow: auto;
        padding: 10px 40px 10px 40px;
        position: fixed;
        left: 20px;
        top: 100px;
        border: 2px solid #2d6de4;
        box-sizing: border-box;
        z-index: 999;
        clip-path: polygon(0 0, calc(100% - 24px) 0, 100% 24px, 100% 100%, calc(100% - 24px) 100%, 24px 100%, 0 calc(100% - 24px), 0 0);
        background:
            linear-gradient(-45deg, #289eef 0, #0c4e81 0) bottom right,

            linear-gradient(45deg, #289eef 17px, #0c4e81 0) bottom left,

            linear-gradient(135deg, #289eef 0, #0c4e81 0) top left,

            linear-gradient(-135deg, #289eef 17px, #0c4e81 0) top right;
        background-size: 51% 51%;

        background-repeat: no-repeat;
    }

    #main-char-3 {
        position: fixed;
        left: 600px;
        bottom: 0;
        width: 60%;
        height: 40%;
    }

    #main-char-4 {
        position: fixed;
        left: 600px;
        top: 0;
        width: 60%;
        height: 60%;
    }

    .villagebutton {
        width: 140px;
        height: 40px;
        margin: 0 10px 10px 0 !important;
        text-align: center;
        background: rgba(13, 29, 79, .6) !important;
        color: #fff !important;
        border-color: rgba(13, 29, 79, .6) !important;
    }

    .villagebutton:hover {
        background: rgb(13, 29, 79) !important;

    }

    .villagebuttons {
        background: rgb(13, 29, 79) !important;
        border-color: rgb(13, 29, 79) !important;
    }

    .anmation {
        transition: all .6s linear;
        position: relative;
        left: -700px;
        opacity: 0;
        height: 0;
    }

    .anmations {
        transition: all .6s linear;
        position: relative;
        left: 0;
        opacity: 1;
        height: 0;
    }

    .anmation1s {
        transition: all .6s linear;
        position: relative;
        left: 700px;
        opacity: 0;
    }

    .anmation1 {
        transition: all .6s linear;
        position: relative;
        left: 0;
        opacity: 1;
    }

    .el-dialog {
        background: rgb(76, 96, 156);
    }

    .el-dialog__header .el-dialog__title {
        color: #fff !important;
    }

    .el-table {
        max-height: 380px;
        overflow: auto;
    }

    .el-table .warning-rows {
        color: #fff;
    }

    .el-table th.el-table__cell {
        background-color: #659bec;
    }

    .el-table .warning-row {
        background: rgb(0, 59, 81);
        color: #fff;
    }

    .el-table .warning-row:hover {
        color: #000;
    }

    .el-table .success-row:hover {
        color: #000;
    }

    .el-table .success-row {
        background: rgb(10, 39, 50);
        color: #fff;
    }

    .btngroup {
        margin-top: 10px;
    }

    .el-table__body {
        width: 100% !important;
    }

    .el-table__body-wrapper {
        height: 47.4px !important;
    }

    .el-table__empty-block {
        min-height: 47.4px;
    }
    .herf {
        color: #fff;
        text-decoration: none;
    }
    .el-breadcrumb {
        font-size: 20px;
        margin-left: 10px;
    }

    .el-breadcrumb__item .el-breadcrumb__inner {
        color: #fff !important;
    }
    .breadcrumb{
        position: fixed;
        left: 10px;
        top: 50px;
    }
</style>

<body>
    <div id="app">
        <div class="breadcrumb" v-if="entersiteflag">
            <el-breadcrumb separator="/">
            <el-breadcrumb-item>沿河土家族自治县</el-breadcrumb-item>
            <el-breadcrumb-item v-if="row">{{row}}</el-breadcrumb-item>
        </el-breadcrumb>
        </div>
        
        <div class="leftBox" v-if="entersiteflag">
            <div :class="[areaIndex===2?'anmation':'anmations']">
                <el-button type="success" plain class="villagebutton" style="margin-right: 5px!important;">
                    <a class="herf" href="./index.html" >←</a>
                </el-button>
                <el-button type="success" plain :class="[btnflag===index?'villagebuttons':'','villagebutton']"
                    v-for="(item,index) in street" :key="index" v-on:click="changestreet(index,item)">{{item.name}}
                </el-button>
            </div>
            <div :class="[areaIndex===1?'anmation1s':'anmation1']">
                <el-button type="success" plain class="villagebutton" v-on:click="villageback"
                    style="margin-right: 5px!important;">→</el-button>
                <el-button type="success" plain :class="[btnflag===index?'villagebuttons':'','villagebutton']"
                    v-for="(item,index) in village" :key="index" v-on:click="changevillage(index,item)">
                    <a class="herf" href="./xingcunrenyuan.html">{{item}}</a>
                </el-button>
            </div>
        </div>
        <div id="main-char-3" v-if="entersiteflag">

        </div>
        <div id="main-char-4" v-if="entersiteflag">

        </div>
    </div>
    <script>
        new Vue({
            el: '#app',
            data: function () {
                return {
                    btnflag: null,
                    bottombtnflag: 0,
                    title: '提示',
                    tableData: [],
                    table: [],
                    areaIndex: 1,
                    village: [],
                    streetMessage: '', //街道社区详细信息
                    siteDetail: "",
                    entersiteflag:true,
                    row:'',
                    // 所有街道社区
                    street: [{
                            name: '团结街道',
                            villages: [
                                '曾子村', '坝坨村', '黄板村', '狮马村', '谢家村', '月亮岩村', '肖家村', '复兴村', '红星桥社区',
                                '田坝社区', '燎原社区', '杨柳池村', '麝香岩村', '石坝沟村', '香树林村', '红花盖村', '黑獭社区'
                            ],
                            messge: '团结街道位于沿河土家族自治县中部的乌江东岸，地处全县政治经济文化中心圈之一，县人民政府驻团结街道田坝社区。东与沙子街道毗邻，南与淇滩镇镶接，北与酉阳土家族苗族自治县丁泗区万木乡接壤，西与和平街道办事处一江之隔，国土面积55.85平方公里。'
                        },
                        {
                            name: '和平街道',
                            villages: [
                                '枫香村', '大坪村', '南山村', '劳联村', '山坪村', '迎将桥社区', '丁字口社区', '花花桥社区', '大溪村',
                                '联桥村', '虎头村'
                            ],
                            messge: '和平街道位于沿河县主城区城乌江西岸，东临沙子街道，南抵淇滩镇，西北接黑水镇，街道办事处驻地丁字口社区，国土面积26.44平方公里，其中耕地面积4.83平方公里，林地21.11平方公里.85平方公里。'
                        },
                        {
                            name: '沙子街道',
                            villages: [
                                '沙子居委会', '十二盘社区', '塘山社区', '新沙社区', '永红村', '南庄村', '龙家岩村', '金龙村',
                                '井田堡村', '甘溪沟村', '石先村', '楠木村', '玉桐村', '偏岩仟村', '纸坊村', '大漆村', '板桥村',
                                '白泥村', '鱼塘村', '明星村', '关土村', '龙凤村', '回洞村', '黄金村', '龙头村', '井坝村',
                                '兴隆村', '岩溪村', '米溪村', '云丰村', '石印村', '大垭口村', '岩门村', '沙子居委会'
                            ],
                            messge: '沙子街道，贵州省铜仁市沿河土家族自治县下辖街道，地处沿河土家族自治县东部，东与重庆市酉阳土家族苗族自治县李溪镇交界，南与中界乡接壤，西与和平镇相连，北与黑獭乡毗邻。辖区东西最大距离12.9千米，南北最大距离18千米，  总面积96.86平方千米。  截至2019年，沙子街道总人口3.3万人。'
                        },
                        {
                            name: '祐溪街道',
                            villages: [
                                '黄板社区', '狮马社区', '谢家社区', '坝坨社区', '曾子社区', '天宫井村', '皂渡村', '腊园村',
                                '白果树村', '联山村', '沙沱社区', '陡滩村', '思源社区', '红旗社区'
                            ],
                            messge: '祐溪街道是贵州省铜仁市沿河土家族自治县下辖街道，街道办驻坝坨社区，国土面积28平方千米，常住人口43279人。'
                        },
                        {
                            name: '黑水镇',
                            villages: [
                                '黑水居委会', '杨寨社区', '龙堡社区', '大山村', '氽塘村', '侯家村', '朝阳村', '建权村', '斜岩村',
                                '尖山村', '龙塘村', '新典村', '桂家山村', '麻竹溪村', '凉村村', '爱群村', '新群村'
                            ],
                            messge: '黑水镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县中部，东与黑獭乡、和平街道相连，南与淇滩镇接壤，西与思渠镇、官舟镇毗邻，北与重庆市酉阳土家族苗族自治县万木乡一衣带水。辖区东西最大距离12.6千米，南北最大距离12.5千米，  总面积89.84平方千米。截至2018年末，黑水镇户籍总人口25037人。'
                        },
                        {
                            name: '谯家镇',
                            villages: [
                                '谯家居委会', '谯家铺社区', '堡上社区', '韩家村', '印山村', '耳当溪村', '桂鲜村', '猫阡坝村',
                                '瓦厂坝村', '大木村', '铅厂坝村', '白石溪村', '长征村', '高田村', '符家寨村', '大土村', '白沙村',
                                '后寨村', '周家村', '枫香垭村', '小河村', '兴隆村', '水田坝村', '汪家村', '大湾村'
                            ],
                            messge: '谯家镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县南端，东与印江土家族苗族自治县沙子坡镇交界，南与德江县枫香溪镇接壤，西与夹石镇相连，西北与淇滩镇交界，北与甘溪乡接界，东北与中界乡、晓景乡毗邻。东西最大距离16.35千米，南北最大距离25.75千米，  总面积163.87平方千米。截至2018年末，谯家镇户籍总人口57055人。'
                        },
                        {
                            name: '夹石镇',
                            villages: [
                                '黄泥社区', '后村社区', '夹石村', '熊家村', '陈家村', '落寨村', '天池村', '侯家坨村', '舟门村',
                                '坪村', '华龙村', '大茶坪村', '先店村', '闵子溪村', '猫踏坪村', '鲁家山村', '老寨村', '池塘村',
                                '三阳村', '旧屋基村', '三孔村', '敖家村', '桃园村', '芶家村', '踩经村', '堰田村', '凤仙村',
                                '谢家渡村', '张家坝村', '大坝村', '旧乡村', '河坝村', '廖园村', '野毛水村', '冷后村', '太红山村',
                                '青杠园村', '上寨村'
                            ],
                            messge: '夹石镇，贵州省铜仁市沿河土家族自治县下辖镇，夹石镇地处沿河土家族自治县南部，东与谯家镇相连，南与德江县长堡乡土家族交界，西与板场乡、土地坳镇接壤，北与甘溪乡毗邻。东西最大距离15.27千米，南北最大距离17.3千米，  总面积135.61平方千米。  截至2018年末，夹石镇户籍总人口52095人。'
                        },
                        {
                            name: '淇滩镇',
                            villages: [
                                '淇滩居委会', '淇滩社区', '狼溪社区', '沙沱社区', '皂渡村', '天宫井村', '腊园村', '白果树村',
                                '梨子水村', '洋楠村', '檬子村', '铜鼓村', '蔡家村', '黄土村', '梅子村', '沙子坡村', '彭华村',
                                '钟岭山村', '蔺华村', '三壶村', '翰林村', '水银洞村', '花园村', '茶坛村', '新型村', '和平村',
                                '竹园村', '艾坝村', '柳池村'
                            ],
                            messge: '淇滩镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县南部，距县城15千米，东与中界乡交界，东南部与谯家镇毗邻，南与甘溪乡接界，西南与板场乡相邻，西与官舟镇相接，西北部黑水乡相连，北与和平镇接壤。东西最大距离12千米，南北最大距离15.65千米，  总面积99.12平方千米。截至2018年末，淇滩镇户籍总人口40851人。'
                        },
                        {
                            name: '官舟镇',
                            villages: [
                                '官舟居委会', '集中社区', '泥马社区', '官舟社区', '和舟社区', '马脑村', '黄龙村', '三角村', '新岩村',
                                '野漆根村', '吴家山村', '曾家沟村', '联坝村', '白马村', '青山庙村', '大桥村', '妙坝村', '枣树村',
                                '中心村', '中华村', '鹿溪村', '木梓岭村', '杨柳村', '红星村', '农庄村', '院子村', '炉泉村',
                                '桃子村', '永和村', '石家山村', '灯塔村', '桂花村', '燎炬村', '清泉村', '水爬岩村', '瓦厂坝村',
                                '肖家坝村', '水库村', '爱新村', '新场村'
                            ],
                            messge: '官舟镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西南部，东与黑水镇、淇滩镇交界，南与板场镇接壤，西与土地坳镇相连，北与思渠镇毗邻。东西最大距离20.75千米，南北最大距离20.15千米，  总面积144.24平方千米。  截至2018年末，官舟镇户籍总人口64879人。'
                        },
                        {
                            name: '土地坳镇',
                            villages: [
                                '前进社区', '竹花社区', '干洞沟村', '五一村', '五四村', '五七村', '木坪村', '安坡村', '竹根坝村',
                                '关怀村', '沙湾村', '丰岩村', '群英村', '马场坝村', '堆山村'
                            ],
                            messge: '土地坳镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西南部，东与官舟镇相连，东南与夹石镇、板场乡接壤，西与德江县荆角土家族乡交界，北与泉坝乡毗邻。东西最大距离13.05千米，南北最大距离13.55千米，  总面积96.85平方千米。截至2018年末，土地坳镇户籍总人口26904人。'
                        },
                        {
                            name: '思渠镇',
                            villages: [
                                '思渠居委会', '思渠社区', '渡江村', '池江村', '雄山村', '荷叶坪村', '院山村', '光荣村', '瑞石坪村',
                                '坪江村', '洞仙村', '高山村', '一口刀村', '马福云村', '前锋村', '民主村', '边疆村', '杨楠村',
                                '华元村', '蛟龙村', '红岩村', '大阡村', '下庄村', '上庄村', '幸元村', '塘堡村', '沙堡村',
                                '斯毛村', '和星村'
                            ],
                            messge: '思渠镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西北部，距县城55千米，东与重庆市酉阳土家族苗族自治县后坪乡交界，东南与黑水乡接壤，南与官舟镇相连，西南部与泉坝乡、中寨乡相接，西与黄土乡接界，北与新景乡毗邻。东西最大距离16.85千米，南北最大距离31.65千米，  总面积185.96平方千米。截至2018年末，思渠镇户籍总人口28635人。'
                        },
                        {
                            name: '客田镇',
                            villages: [
                                '客田居委会', '客田社区', '隘头村', '坝头山村', '后山村', '蒲井村', '四坪村', '红溪村', '黄家村',
                                '冯家村', '大兴村'
                            ],
                            messge: '客田镇，贵州省铜仁市沿河土家族自治县下辖镇，客田镇地处沿河土家族自治县西北部，东与新景乡接壤，南与遵义市务川仡佬族苗族自治县蕉坝乡交界，西与洪渡镇相连，北与后坪乡、塘坝乡毗邻。东西最大距离16.8千米，南北最大距离17.15千米，  总面积147.75平方千米。截至2018年末，客田镇户籍总人口20243人。'
                        },
                        {
                            name: '洪渡镇',
                            villages: [
                                '洪渡居委会', '洪渡社区', '洞子溪村', '龙泉村', '王坨村', '皂角村', '双泉村', '苏家村'
                            ],
                            messge: '洪渡镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西北乌江岸边，东与重庆市酉阳土家族苗族自治县龚滩镇一江之隔，南与新景乡接壤，西南与客田镇相连，西与塘坝乡毗邻，北与重庆市彭水苗族土家族自治县双龙乡、善感乡、鹿角乡3乡交界。东西最大距离8.67千米，南北最大距离19.12千米，  总面积76.15平方千米。截至2018年末，洪渡镇户籍总人口10784人。'
                        },
                        {
                            name: '中界镇',
                            villages: [
                                '中界居委会', '中界社区', '孙家社区', '黄家洞村', '东流村', '龙兴村', '银山村', '高井村', '天坪村',
                                '庄严村', '河坎村', '心齐村', '罗家寨村', '大龙村', '皂角水村', '石柱村', '坡脚村', '高峰村',
                                '蛟坝村', '陡滩村', '联山村', '大丰村', '水田村'
                            ],
                            messge: '中界镇，贵州省铜仁市沿河土家族自治县下辖镇，  地处沿河土家族自治县东南部，东与重庆市酉阳土家族苗族自治县李溪镇交界，南与晓景乡相连，西与和平镇相邻，西南与谯家镇、淇滩镇毗邻，北与沙子镇接壤。辖区东西最大距离10.10千米，南北最大距离17.7千米，  总面积75.65平方千米。截至2018年末，中界镇户籍总人口26518人。'
                        },
                        {
                            name: '甘溪镇',
                            villages: [
                                '甘溪居委会', '上坝社区', '共甘社区', '江边村', '阳春村', '里户村', '芭蕉村', '后坝村', '大田村',
                                '塘边村', '桂林村', '土门村', '仁和村', '曹家村', '春芹村', '任家宅村', '老宅村', '严家村',
                                '茶园村', '大吉村', '麝香村', '四堡村', '沙坝村', '毛田村', '白鹤村', '胡革村', '齐心村',
                                '关联村', '雄水村', '桑木村'
                            ],
                            messge: '甘溪镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县南部，乌江东岸，东与谯家镇交界，南与夹石镇毗邻，西与板场镇相连，北与淇滩镇接壤。东西最大距离12.9千米，南北最大距离13.75千米，  总面积109.01平方千米。  截至2018年末，甘溪镇户籍总人口39769人。'
                        },
                        {
                            name: '板场镇',
                            villages: [
                                '板场居委会', '东红社区', '板场社区', '塘坝村', '田坝村', '徐家村', '蒲楠村', '龙鱼村', '联文村',
                                '爱华村', '电光村', '大松村', '大坨坝村', '友谊村', '河沟村', '刘家村', '卫星村', '洋溪村',
                                '永东村', '永丰村', '枫香岭村', '任桂村', '光辉村', '熊家沟村'
                            ],
                            messge: '板场镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西南部，乌江西岸，东与淇滩镇交界，南与甘溪镇接壤，西与土地坳镇相连，北与官舟镇毗邻。辖区东西最大距离15.20千米，南北最大距离11.5千米，  总面积103.19平方千米。  截至2018年末，板场镇户籍总人口38630人。'
                        },
                        {
                            name: '泉坝镇',
                            villages: [
                                '泉坝社区', '泉山村', '泉塘村', '泉堡村', '泉坡村', '捷克村', '黄池村', '捷梁村', '新竹村',
                                '水田村', '三坝村', '马家村', '岩园村', '大泉村', '算子村'
                            ],
                            messge: '泉坝镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西部，东与官舟镇接壤，南与土地坳镇相连，西与德江县泉口土家族乡交界，北与中寨乡相接，东北与思渠镇毗邻。辖区东西最大距离15.8千米，南北最大距离14.85千米，  总面积104.24平方千米。截至2018年末，泉坝镇户籍总人口28008人。'
                        },
                        {
                            name: '中寨镇',
                            villages: [
                                '寨社区', '清峰村', '清塘村', '清河村', '金山村', '大宅村', '勤俭村', '三会溪村', '移山村',
                                '大堡村', '志强村', '杨坪村', '大坪村', '红色村'
                            ],
                            messge: '中寨镇，为贵州省铜仁市沿河县下辖镇，位于沿河自治县城西北部，距县城87公里，552县道横穿其境，西部与德江县泉口镇交界，西北部与遵义市务川县红丝乡接壤，东部与思渠镇相连，东南部与泉坝镇相接，北部与黄土镇毗邻。最高海拔1360米，最低海拔400米，构成了低中河谷沟垅地貌。国土总面积111.8平方千米，占全县总面积的4.57%。'
                        },
                        {
                            name: '黄土镇',
                            villages: [
                                '黄土社区', '花桥社区', '丰收村', '竹园村', '双龙村', '简家村', '雪花村', '汤家村', '勇敢村',
                                '平原村', '青龙村', '花溪村', '沙坪村', '杨家村', '大元村'
                            ],
                            messge: '黄土镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西北部，东与思渠镇相连，南与遵义务川仡佬族苗族自治县红丝乡交界，西与中寨乡毗邻，北与新景乡相接。辖区东西最大距离21.4千米，南北最大距离16.9千米，  总面积167.74平方千米。截至2018年末，黄土镇户籍总人口21177人。'
                        },
                        {
                            name: '新景镇',
                            villages: [
                                '新景居委会', '新仲社区', '姚溪村', '白果村', '龙山村', '中元村', '瑞石村', '锦溪村', '桂花村',
                                '长依村', '毛家村', '石界村', '青山村'
                            ],
                            messge: '新景镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西北部乌江西岸，东与重庆市酉阳土家族苗族自治县龚滩镇交界，东南与思渠镇相连，南与黄土乡相接，西与客田镇接界，北与洪渡镇毗邻。辖区东西最距离14.65千米，南北最大距离23.05千米，  总面积155.52平方千米。截至2018年末，新景镇户籍总人口20248人。'
                        },
                        {
                            name: '塘坝镇',
                            villages: [
                                '花桥社区', '元布村', '榨子村', '楠木村', '金竹村', '四塘溪村', '土溪村', '马鞍山村', '小石界村',
                                '岩头村', '红竹村', '姜花村', '石花村', '石泉村', '凤凰村', '龙桥村'
                            ],
                            messge: '塘坝镇，贵州省铜仁市沿河土家族自治县下辖镇，地处沿河土家族自治县西北部，东与洪渡镇接壤，南与客田镇相连，西与后坪乡毗邻，北与重庆市彭水苗族土家族自治县朗溪镇交界。辖区东西最大距离15.65千米，南北最大距离14.35千米，  总面积121.18平方千米。截至2018年末，塘坝镇户籍总人口21226人。'
                        },
                        {
                            name: '晓景乡',
                            villages: [
                                '晓景村', '管家村', '暗塘村', '侯家寨村', '水池村', '新华村', '板山村', '七三村', '野溪村',
                                '干木村', '新河村', '高寨村', '大土村', '核桃湾村', '吴家村', '小溪村', '苦竹村'
                            ],
                            messge: '晓景乡，贵州省铜仁市处沿河土家族自治县下辖乡，地处沿河土家族自治县东南部，距县城28千米，东与重庆市酉阳土家族苗族自治县李溪镇交界，东南与松桃苗族自治县甘龙镇接壤，南与印江土家族苗族自治县刀坝乡相连，西与谯家镇相接，北与中界乡毗邻。东西最大距离7.45千米，南北最大距离18.35千米，  总面积83.22平方千米。截至2018年末，晓景乡户籍总人口16545人。'
                        },
                        {
                            name: '后坪乡',
                            villages: [
                                '茨坝村', '斯毛坝村', '红阳村', '双坪村', '下坝村', '水井村', '河兴村', '楠木村', '观音村',
                                '茶园村', '玉泉村'
                            ],
                            messge: '后坪乡，贵州省铜仁市沿河土家族自治县下辖乡，地处沿河土家族自治县西北角，东与塘坝乡相连，南与客田镇毗邻，西与遵义市务川仡佬族苗族自治县茅天镇接壤，北与重庆市彭水苗族土家族自治县朗溪镇交界。辖区东西最大距离11千米，南北最大距离21.25千米，  总面积为109.51平方千米。截至2018年末，后坪乡户籍总人口14681人。'
                        },
                    ],
                    messageSheet: [{
                            id: 1,
                            name: '居住信息表'
                        },
                        {
                            id: 2,
                            name: '户口户籍信息表'
                        },
                        {
                            id: 3,
                            name: '人员基本信息表'
                        },
                        {
                            id: 4,
                            name: '社保信息表'
                        },
                        {
                            id: 5,
                            name: '医保信息表'
                        },
                        {
                            id: 6,
                            name: '健康信息表'
                        },
                        {
                            id: 7,
                            name: '疫苗接种信息表'
                        },
                        {
                            id: 8,
                            name: '培训信息表'
                        },
                        {
                            id: 9,
                            name: '就业信息表'
                        },
                        {
                            id: 10,
                            name: '学生信息表'
                        },
                        {
                            id: 11,
                            name: '车辆信息表'
                        },
                        {
                            id: 12,
                            name: '房屋信息表'
                        },
                        {
                            id: 13,
                            name: '房屋附加表'
                        },
                        {
                            id: 14,
                            name: '田土信息表'
                        },
                    ],

                }
            },
            created(){
                let entersite = window.location.search.split('=')[1]
                if(entersite!=='%E6%B2%BF%E6%B2%B3%E5%9C%9F%E5%AE%B6%E6%97%8F%E8%87%AA%E6%B2%BB%E5%8E%BF'){
                    this.entersiteflag = false
                }
            },
            mounted() {
                let dataAxismian3 = ['贵阳', '遵义', '六盘水', '安顺', '黔西南', '黔东南', '黔南布', '铜仁', '毕节'];
                // prettier-ignore
                let datamian3 = [461.165, 372.005, 133.962, 99.675, 135.34, 119.152, 159.54, 132.779, 202.039];
                let yMaxmain3 = 500;
                let dataShadowmain3 = [];
                for (let i = 0; i < datamian3.length; i++) {
                    dataShadowmain3.push(yMaxmain3);
                }
                optionsmain3 = {
                    title: {
                        text: '贵州各市GDP比例',
                        left: 'center',
                        top: 0,
                        textStyle: { // 标签的字体样式
                            color: '#ffffff', // 地图初始化区域字体颜色
                            fontSize: 20, // 字体大小
                            opacity: 1, // 字体透明度
                            backgroundColor: '#fff', // 字体背景色
                        },
                        subtext: '单位：十亿元'
                    },
                    xAxis: {
                        data: dataAxismian3,
                        axisLabel: {
                            inside: false,
                            color: '#ffffff'
                        },
                        axisTick: {
                            show: true
                        },
                        axisLine: {
                            show: false
                        },
                        z: 10
                    },
                    yAxis: {
                        axisLine: {
                            show: false
                        },
                        axisTick: {
                            show: false
                        },
                        axisLabel: {
                            color: '#ffffff'
                        }
                    },
                    dataZoom: [{
                        type: 'inside'
                    }],
                    series: [{
                        type: 'bar',
                        showBackground: true,
                        itemStyle: {
                            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                    offset: 0,
                                    color: '#83bff6'
                                },
                                {
                                    offset: 0.5,
                                    color: '#188df0'
                                },
                                {
                                    offset: 1,
                                    color: '#188df0'
                                }
                            ])
                        },
                        emphasis: {
                            itemStyle: {
                                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                                        offset: 0,
                                        color: '#2378f7'
                                    },
                                    {
                                        offset: 0.7,
                                        color: '#2378f7'
                                    },
                                    {
                                        offset: 1,
                                        color: '#83bff6'
                                    }
                                ])
                            }
                        },
                        data: datamian3
                    }]
                };
                // Enable data zoom when user click bar.
                const zoomSizemain3 = 6;

                var myChartmian3 = echarts.init(document.getElementById('main-char-3'));

                myChartmian3.setOption(optionsmain3)



                let myChartmian4 = document.getElementById('main-char-4');
                let myChart = echarts.init(myChartmian4);
                let option = {
                    title: {
                        text: '贵州各市人口统计',
                        left:'center',
                        top: 0,
                        textStyle: { // 标签的字体样式
                            color: '#ffffff', // 地图初始化区域字体颜色
                            fontSize: 20, // 字体大小
                            opacity: 1, // 字体透明度
                            backgroundColor: '#fff', // 字体背景色
                        },
                        subtext: '单位：万人'
                    },
                    series: [{
                        name: 'Area Mode',
                        type: 'pie',
                        radius: [20, 140],
                        center: ['50%', '50%'],
                        roseType: 'area',
                        itemStyle: {
                            borderRadius: 5
                        },
                        data: [{
                                value: 462.18,
                                name: '贵阳（462.18）'
                            },
                            {
                                value: 619.21,
                                name: '遵义（619.21）'
                            },
                            {
                                value: 288.99,
                                name: '六盘水（288.99）'
                            },
                            {
                                value: 231.35,
                                name: '安顺（231.35）'
                            },
                            {
                                value: 282.16,
                                name: '黔西南（282.16）'
                            },
                            {
                                value: 348.54,
                                name: '黔东南（348.54）'
                            },
                            {
                                value: 342.22,
                                name: '黔南布（342.22）'
                            },
                            {
                                value: 312.24,
                                name: '铜仁（312.24）'
                            },
                            {
                                value: 660.61,
                                name: '毕节（660.61）'
                            },
                        ]
                    }]
                };
                option && myChart.setOption(option);

            },
            methods: {

                // 选择镇
                changestreet(ind, e) {
                    this.siteDetail = e.name
                    this.row = e.name
                    this.areaIndex = 2
                    this.streetMessage = e.messge
                    this.village = e.villages
                },
                villageback() {
                    this.areaIndex = 1
                    this.streetMessage = null
                    this.row = ''
                },
                // 选择村
                changevillage(ind, e) {
                    this.siteDetail = this.siteDetail + '-' + e
                    localStorage.setItem('site', this.siteDetail)
                    this.btnflag = ind
                    this.bottombtnflag = 0
                    this.tableData = this.tableDataone
                    this.table = this.tableOne
                },

                // handleClose(done) {
                //     this.$confirm('确认关闭？')
                //         .then(_ => {
                //             done();
                //         })
                //         .catch(_ => {});
                // },
                tableRowClassName({
                    row,
                    rowIndex
                }) {
                    if (rowIndex % 2 === 0) {
                        return 'warning-row';
                    } else if (rowIndex % 2 === 1) {
                        return 'success-row';
                    }
                    return '';
                },
                headerRowClassName({
                    rowIndex
                }) {
                    if (rowIndex === 0) {
                        return 'warning-rows';
                    }
                    return '';
                }
            }
        })
    </script>
</body>

</html>